<!doctype html>
<html>

  <head>
    <meta charset="utf-8">
    <title>知识库</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <link href="../../../css/mui.min.css" rel="stylesheet" />
    <link href="../css/common.css" rel="stylesheet" />
    <style type="text/css">
      #menu img{
        width: 80px;
        height: 80px;
      }
      .mui-content{
        padding: 0 8px;
      }
      .mui-row{
        margin-top: 10px;
      }
      .menu-item{
        padding: 7px 8px;
      }
      
      .menu-item>div{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        background-color: #fff;
        box-shadow: 0px 0px 8px 0px rgba(131, 144, 155, 0.39);
        border-radius: 7px;
        padding: 15px;
      }
    </style>
  </head>

  <body>
    <header class="mui-bar mui-bar-nav">
      <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
      <h1 class="mui-title">知识库</h1>
    </header>
    <div class="mui-content">
      <div class="mui-row" id="menu">
        <div class="mui-col-sm-6 mui-col-xs-6 menu-item" data-url="./standard/list.html">
          <div>
            <img src="../img/knowledge/zhishiku_biaozhunguifanku.png" >
            <div>
              标准规范库
            </div>
          </div>
        </div>
        <div class="mui-col-sm-6 mui-col-xs-6 menu-item" data-url="./device/list.html">
          <div>
            <img src="../img/knowledge/zhishiku_shebeiziliaoku.png" >
            <div>
              设备资料库
            </div>
          </div>
        </div>
        <div class="mui-col-sm-6 mui-col-xs-6 menu-item" data-url="./technology/list.html">
          <div>
            <img src="../img/knowledge/zhishiku_jishujiaoliu.png" >
            <div>
              技术交流
            </div>
          </div>
        </div>
        <div class="mui-col-sm-6 mui-col-xs-6 menu-item" data-url="./faultCase/list.html">
          <div>
            <img src="../img/knowledge/zhishiku_guzhanganliji.png" >
            <div>
              故障案例集
            </div>
          </div>
        </div>
        <div class="mui-col-sm-6 mui-col-xs-6 menu-item" data-url="./collection/list.html">
          <div>
            <img src="../img/knowledge/zhishiku_wodeshoucang.png" >
            <div>
              我的收藏
            </div>
          </div>
        </div>
        <div class="mui-col-sm-6 mui-col-xs-6 menu-item" data-url="./myDown/list.html">
          <div>
            <img src="../img/knowledge/zhishiku_wodexiazai.png" >
            <div>
              我的下载
            </div>
          </div>
        </div>
      </div>
    </div>
    <script type="text/javascript" src="../../../js/mui.js"></script>
    <script type="text/javascript" src="../../../js/jquery-3.2.1.min.js"></script>
    <script type="text/javascript">
      mui.init()
      $("#menu").on("click", '.menu-item', function(e) {
        let href = $(this).data('url')
        mui.openWindow({
          url: href,
          id: href
        })
      })
    </script>
  </body>

</html>
